<template>
  <!-- 催收执行页-案件信息模块-修复信息 -->
  <section class="component fix-info">
    <data-box :data="dataSet">
      <template slot="columns">
        <el-table-column prop="repairDate" label="修复时间" :formatter="row => $filter.dateTimeFormat(row.repairDate)" :min-width="$helper.getColumnWidth(3)"></el-table-column>
        <el-table-column prop="repairExplain" label="修复说明" show-overflow-tooltip :min-width="$helper.getColumnWidth(7)"></el-table-column>
        <el-table-column prop="repairCollectorName" label="修复人" :min-width="$helper.getColumnWidth(3)"></el-table-column>
        <el-table-column label="操作" :min-width="$helper.getOperateWidth(1)">
          <template slot-scope="scope">
            <el-button type="text" @click="fileIds = scope.row.fileIds,dialog.fileList = true">查看附件</el-button>
          </template>
        </el-table-column>
      </template>
    </data-box>
    <el-dialog title="附件信息" :center="true" :visible.sync="dialog.fileList" width="800px" append-to-body>
      <view-attach-list :fileIds="fileIds" @close="dialog.fileList = false"></view-attach-list>
    </el-dialog>
  </section>
</template>

<script lang="ts">
import Vue from 'vue';
import Component from 'vue-class-component';
import { Dependencies } from "~/core/decorator";

import { RepairCasesService } from "~/services/domain-service/repair-cases.service";
import { Emit, Prop, Watch } from "vue-property-decorator";
import ViewAttachList from "~/components/common/view-attach-list.vue";
import { namespace } from "vuex-class";

const CollectionExecutionModule = namespace("collection-execution");


@Component({
  components: {

    ViewAttachList
  },
})
export default class FixInfo extends Vue {
  @Dependencies(RepairCasesService) private repairCasesService: RepairCasesService;
  @CollectionExecutionModule.State private caseId;
  private dataSet: any[] = [];
  private fileDataSet: any[] = []
  private dialog = {
    fileList: false
  }

  private fileIds: string = ""

  public queryInfo(id: string) {
    this.repairCasesService.queryRepairCaseInfo(id).subscribe(
      data => this.dataSet = data
    )
  }

  private activated() {
    if (this.caseId) this.queryInfo(this.caseId)
  }

}
</script>

<style lang="less" scoped>
</style>
